<template>
  <PageContainer>
    <view>
      <Header title="业务结果" />
      <view class="container disFlxCC">
        <view class="ali-icon icon-danxuan_xuanzhong mb-16"></view>
        <text class="fz-18 mb-24">表单已开放填写</text>
        <TButtonGroup position="unset">
          <TButton
            text="查看表单"
            type="none"
            custom-class="br-16  fz-14"
            :custom-style="{
              width: '176rpx',
              height: '64rpx',
              lineHeight: '64rpx',
              color: '#fff',
              border: 'solid 1px #fff',
              marginRight: '24rpx',
            }"
            @click="toViewServiceForm"
          />
          <TButton
            text="邀请填写"
            type="none"
            custom-class="br-16  fz-14"
            open-type="share"
            :custom-style="{
              width: '176rpx',
              height: '64rpx',
              lineHeight: '64rpx',
              color: '#2878FF',
              border: 'solid 1px #fff',
              backgroundColor: '#fff',
              marginLeft: '24rpx',
            }"
          />
        </TButtonGroup>
      </view>
    </view>
  </PageContainer>
</template>

<script lang="ts" setup>
  /* createServiceFormResult 添加题目 */
  import Header from '@/components/Header/index.vue';
  import PageContainer from '@/components/PageContainer/index.vue';
  import TButton from '@/components/TButtonGroup/TButton.vue';
  import TButtonGroup from '@/components/TButtonGroup/index.vue';
  import { ShareTypeEnum } from '@/enums/shareEnum';
  import { useAppShare } from '@/hooks/core/useAppShare';
  import { onLoad, redirectTo } from '@/router';
  import { useAppStore } from '@/store/modules/app';
  import { onShareAppMessage } from '@dcloudio/uni-app';
  import { ref } from 'vue';

  const { setWxSharePath } = useAppShare();
  const { hasShareImgConfig } = useAppStore();

  const title = ref<string>();
  const serviceTicketFormId = ref<number>();
  onLoad<'createServiceFormResult'>((op) => {
    title.value = op.title;
    serviceTicketFormId.value = op.serviceTicketFormId;
  });

  const toViewServiceForm = () =>
    redirectTo({
      name: 'serviceFormPreview',
      options: {
        serviceTicketFormId: serviceTicketFormId.value as number,
      },
    });

  onShareAppMessage(() => {
    const res = hasShareImgConfig(ShareTypeEnum.invitationToFillOutServiceForm);
    return {
      title: title.value,
      path: setWxSharePath({
        name: 'serviceFormFilling',
        options: {
          serviceTicketFormId: serviceTicketFormId.value as number,
        },
      }),
      imageUrl: res?.iconUrl,
    };
  });
</script>

<style lang="scss" scoped>
  .container {
    background-color: #2878ff;
    height: 440rpx;
    color: #fff;
    .ali-icon {
      color: #fff;
      font-size: 128rpx;
    }
  }
</style>
